import React, { Component, Fragment } from 'react';
import { Link } from 'dva/router';
import { connect } from 'dva';
import router from 'umi/router';
import styles from './index.less';
import { Card, Switch, Input, Radio, Checkbox, Form, Button, message, Spin, Row, Col,Select, Tag,Icon,Modal,Cascader } from 'antd';
const FormItem = Form.Item;

@Form.create()
export default class Index extends Component {
  state={
    modalVisible:false,
    confirmLoading:false,
  }

  componentWillMount(){
    window.Isoption = false;
  }

  componentDidMount(){
    window.Isoption = true;
    const {onRef} = this.props;
    onRef&&onRef(this);
  }

  okHandle = () => {
    const { dispatch, form, GetDeliveryManPageList } = this.props;
    form.validateFields(['UserName','Tel'],(err, values) =>{
      if(err) return;
      this.setState({confirmLoading:true});
      dispatch({
        type: `localdelivery/AddMan`,
        payload: {
          UserName:values.UserName,
          Tel:values.Tel
        },
        callBack: {
          success: (data) => {
            message.success("新增成功");
            this.setState({modalVisible:false,confirmLoading:false});
            GetDeliveryManPageList();
          },
          error: (data) => {
            this.setState({confirmLoading:false});
            message.error("新增失败：" + data.Msg);
          }
        }
      });
    })
  }
  handelManModal = (flag) => {
    this.setState({modalVisible:!!flag})
  }

  render() {
    const { form: { getFieldDecorator,getFieldValue } }=this.props;
    const { modalVisible,confirmLoading }=this.state;
    return (
      <Modal
          destroyOnClose
          centered
          title="添加配送员"
          visible={modalVisible}
          onOk={this.okHandle}
          confirmLoading={ confirmLoading }
          onCancel={()=>this.handelManModal()}
          width={520}
        >
          <Form>
            <FormItem
              labelCol={{ span: 6 }}
              wrapperCol={{ span: 14 }}
              label="配送员姓名"
            >
              {getFieldDecorator('UserName',{
                rules: [{ required: true, message:'此项为必选项' }],
              })(
                <Input style={{ width: '100%' }}/>
              )}
            </FormItem>
            <FormItem
            labelCol={{ span: 6 }}
            wrapperCol={{ span: 14 }}
            label="联系方式"
            >
              {getFieldDecorator('Tel',{
                rules: [{ required: true, message:'此项为必选项' }],
              })(
                <Input style={{ width: '100%' }}/>
              )}
            </FormItem>
          </Form>
        </Modal>
    )
  }
}
